:root {
	--totalWid: 100vw;
}
html,
body {
	width: 100%;
}

/* 头部 */
header {
	width: 100%;
	height: 65px;
	border-bottom: 1px solid #ccc;
	opacity: 1;
}

header > a {
	display: block;
	height: 65px;
	width: 150px;
}

header > a h1 {
	background: url(../imgs/new-logo-white.png) no-repeat;
	height: 65px;
}

header ul li {
	margin: 15px;
	height: 65px;
	line-height: 65px;
}

header ul li.active {
	border-bottom: 2px solid #fff;
}
header ul li a {
	color: #fff;
}
header div span {
	display: inline-block;
	padding: 4px 8px;
	border-radius: 15px;
}
header div span a {
	color: #fff;
}
header div span:first-child {
	border: 1px solid #fff;
	margin-right: 15px;
}

header div span:last-child {
	background-color: #ed510a;
}

/* banner区 */
#banner {
	width: 100%;
	height: 680px;
}
#banner .swiper-wrapper div {
	width: 100%;
	height: 680px;
}
#banner .swiper-wrapper div:first-child {
	background: url(../imgs/banner1.png) no-repeat center;
}
#banner .swiper-wrapper div:nth-child(2) {
	background: url(../imgs/banner2.png) no-repeat center;
}
#banner .swiper-wrapper div:last-child {
	background: url(../imgs/banner3.png) no-repeat center;
}

/* 云服务 */
#cloudServices {
	width: 100%;
	height: 630px;
}
#cloudServices ul {
	margin-left: 60px;
}
#cloudServices ul li {
	width: 240px;
	height: 280px;
	margin-right: 40px;
}
/* 海量API */
#api {
	width: 100%;
	height: 645px;
	background: url(../imgs/more-api-bg.svg) no-repeat center;
}
#api .container ul {
	width: 100%;
	height: 300px;
}
#api .container ul li {
	width: 225px;
	height: 140px;
}
/*  慧集 */
#master {
	width: 100%;
	height: 765px;
}
#master .content > img {
	height: 550px;
}
#master ul {
	height: 508px;
}
#master ul li {
	position: relative;
	width: 508px;
	height: 80px;
}
#master ul li::before {
	content: "";
	display: inline-block;
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -12px;
	width: 4px;
	height: 24px;
	background-color: #1271efb0;
}
/* 独角兽 */
#unicorn {
	width: 100%;
	height: 560px;
}
#bcg {
	bottom: 0;
	left: 0;
	width: 100%;
	height: 270px;
	z-index: 1;
}
.show {
	left: 50%;
	bottom: 0;
	transform: translate(-50%);
	z-index: 9;
	display: flex;
	width: 1200px;
	height: 290px;
	opacity: 0;
}
.show > img {
	width: 576px;
	height: 290px;
}
#unicornText {
	box-sizing: border-box;
	padding: 0 70px;
	height: 290px;
}
#unicornText p:nth-child(2) {
	line-height: 30px;
}
#unicornText p:nth-child(3) {
	position: relative;
	line-height: 60px;
	text-align: right;
}
#unicornText p:nth-child(3)::before {
	position: absolute;
	right: 88px;
	top: 28px;
	content: "";
	display: block;
	width: 12px;
	height: 4px;
	background-color: #1271efb0;
}
/* 数据安全 */
#safe {
	width: 100%;
	height: 440px;
}
#safe ul {
	width: 100%;
	height: 140px;
	align-items: baseline;
}
#safe ul li {
	width: 150px;
	height: 110px;
}
#safe ul li img {
	margin-bottom: 10px;
}
/* 广告 */
#adv {
	width: 100%;
	height: 240px;
	background: url(../imgs/more-api-bg.svg) no-repeat center #1271ef;
}
#adv a {
	display: block;
	width: 130px;
	height: 40px;
	line-height: 40px;
	border: 1px solid #fff;
}

/* 尾部 */
footer {
	width: 100%;
	height: 330px;
}
footer .container {
	display: flex;
	flex-direction: column;
}
footer .listTop {
	width: 745px;
	height: 210px;
}

footer .listTop .list-item {
	height: 155px;
}
footer .listTop .wechat {
	width: 135px;
	height: 210px;
}
footer .last {
	width: 100%;
	height: 35px;
}
footer .last .agree {
	display: flex;
	width: 660px;
}
